<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/register.css">
    <link rel="stylesheet" href="font/iconfont.css">
    <link rel="stylesheet" href="css/reset.css">
</head>

<body>
    <!-- 网页的头部 -->
    <div id="header">
        <div id="header-1">
            <div class="left">
                <p>嗨，欢迎来订花乐！</p>
                <a href="" style="color: rgb(136, 78, 34);">
                    <i class="iconfont">&#xe62b;</i>
                </a>
                <a href="" id="weixin">关注微信</a>
                <img src="./images/gz.jpg" alt="" id="img">  
            </div>

            <div class="right">
                <a href="./login.html" class="r-1">你好，请登录</a>
                <a href="./register.html" class="r-2" style="color: rgb(136, 78, 34);">免费注册</a>
                <span class="s-1"></span>
                <a href="./order.html" class="r-3">订单查询</a>
                <span class="s-2"></span>
                <a href="./shopping.html" class="r-4" style="color: rgb(136, 78, 34);"> <span>
                        <i class="iconfont">&#xe600;</i>
                        购物车</span>
                </a>
                <span class="s-3"></span>
                <a href="" id="phone">手机下单</a>
                <img src="./images/sm.png" alt=""  id="rders">
            </div>
        </div>
    </div>

    <div class="header-2">
        <a href="./index.html" class="header-2-1">
            <img src="images/logo.png" alt="">
        </a>
        <div class="header-4">
            <a href="" class="h-4-1">
                <i class="iconfont">&#xe668;</i>
                <span>400-060-1520</span>
            </a>
        </div>
    </div>

    <div class="nav">
        <img src="./images/huayishi.jpg" alt="">

        <div class="form">
            <div class="f-1">
                <span class="f-1-1">手机账号注册</span>
            </div>

            <div class="f-2">
                <div class="f-2-1">
                    <img src="./images/touxiang.png" alt="">
                    <input id="tel" type="text" placeholder="请输入账号">
                </div>
                <!-- <div class="f-2-1"> -->
                    <!-- <img src="./images/yanzhengma.png" alt="">
                    <input type="text" placeholder="请输入验证码">
                    <span>获取验证码</span> -->
                <!-- </div> -->
                <div class="f-2-1">
                    <img src="./images/mima.png" alt="">
                    <input id="password" type="password" placeholder="请输入密码">
                </div>
                <!-- <div class="f-2-1">
                    <img src="./images/mima.png" alt="">
                    <input type="text" placeholder="请重复输入密码">
                </div> -->


                <div class="button">
                    <input type="button" value="注册" class="btn" id="submit">
                </div>

                <div class="f-2-3">
                    <img src="./images/zhifubao.png" alt="">
                    <a href="https://auth.alipay.com/login/index.htm?goto=https%3A%2F%2Fopenauth.alipay.com%3A443%2Foauth2%2FpublicAppAuthorize.htm%3Fapp_id%3D2021001167695057%26scope%3Dauth_user%26redirect_uri%3Dhttp%253A%252F%252Fcs.dinghuale.com%252Fapi%252Fhuidiao%26state%3D121.196.121.49">支付宝</a>

                    <img src="./images/weixin.png" alt="">
                    <a href="https://open.weixin.qq.com/connect/qrconnect?appid=wx4c5280fbb2d8e83c&redirect_uri=http%3A%2F%2Fcs.dinghuale.com%2Fapi%2Fwxhuidiao&response_type=code&scope=snsapi_login&state=121.196.121.49#wechat_redirect">微信</a>

                    <a href="./register.html" class="f-2-4">
                        <span>  注册账号 ></span>
                    </a>
            </div>
        </div>

        </div>
    </div>



    <div class="bottom">
        <div class="bottom-1">
            <div class="bottom-1-1">
                <a href="">
                    <img src="images/logo.png" alt="">
                </a>
            </div>

            <div class="bottom-2">
                <div class="bottom-2-1">
                    <p>热门导航</p>
                    <a href="./index.html" class="footer-nav-item">网站首页</a>
                    <a href="./flower.html" class="footer-nav-item">网站首页</a>
                    <a href="./order.html" class="footer-nav-item">订单查询</a>
                    <a href="./flower.html" class="footer-nav-item">全部商品</a>

                </div>
                <div class="bottom-2-2">
                    <div class="bottom-2-2-1">
                        <p>客服服务</p>
                        <a href="">关于我们</a>
                        <a href="">服务声明</a>
                        <a href="">订花流程</a>
                        <a href="">支付方式</a>
                    </div>
                    <div class="bottom-2-2-2">
                        <a href="">配送说明</a>
                        <a href="">售后服务</a>
                        <a href="">隐私条款</a>
                        <a href="">联系我们</a>
                    </div>

                </div>
                <div class="bottom-2-3">
                    <p>联系我们</p>
                    <a href="">意见反馈</a>
                    <a href="">工作时间：07:00-23:00</a>
                    <a href="">7*24小时在线订购</a>
                    <a href="">全国热线：400-060-1520</a>
                </div>


            </div>
            <div class="bottom-2-4">
                <img src="images/erweima.jpg" alt="" class="bottom-2-4-1">
                <p>扫码关注微信</p>
            </div>


        </div>





    </div>

    <div class="footer-bottom">
        <p class="text-color-9">Copyright©2020 &nbsp;成都勿忘我科技有限公司 &nbsp;
            </br>
            <a href="">蜀ICP备20016463号-2</a>&nbsp;
        </p>
    </div>


</body>
<script src="js/header.js"></script>
<script src="js/jquery.2.2.4.js"></script>

<script>
    
    $("#submit").click(function(){
        if ($("#tel").val()==""||$("#password").val()==""){
            alert("请输入账号密码")
            return;
        }



        // 收集用户输入的信息，通过ajax发往后端，等待返回信息
        $.ajax({
            url:"http://localhost:3000/api",
            data:{
                type:"register",
                username:$("#tel").val(),
                password:$("#password").val()
            },
            success:res=>{
                // 解析后端返回的信息，判断注册成功或是失败
                res = JSON.parse(res)
                console.log(res);
                if(res.code === 1){
                    // 注册成功的处理
                    if(confirm("注册成功，是否跳转到登录")){
                        // location.assign("./login.html")
                        location.href = "./login.html";
                    }
                }else if(res.code === 0){
                    // 注册失败的处理
                    alert(res.title + "，注册失败");
                }
            }
        })
    })


</script>
   


</html>